import type { TableColumnCtx } from 'element-plus'

// 表格行数据基础类型
export type DefaultRow = Record<PropertyKey, unknown>

// 基础表格项接口
export interface BaseTableItem {
  id: string | number
}

// 表格数据项类型
export type TableItem<T = DefaultRow> = T & BaseTableItem

// 自定义的列属性
interface CustomColumnOptions {
  slot?: string
  headerSlot?: string
}

// 表格列配置接口
export type TableColumn<T extends DefaultRow = DefaultRow> = Partial<
  Omit<TableColumnCtx<T>, 'formatter' | 'renderHeader'>
> & {
  label: string
  prop: keyof T & string
  formatter?: (
    row: T,
    column: TableColumnCtx<T>,
    cellValue: T[keyof T],
    index: number,
  ) => string | VNode
  renderHeader?: (data: { column: TableColumnCtx<T>; $index: number }) => VNode
} & CustomColumnOptions

export interface TableProps<T extends Record<PropertyKey, unknown> = Record<PropertyKey, unknown>> {
  // 表格数据
  data?: T[]
  // 列配置
  columns: TableColumn<T>[]
  // 是否显示多选
  showSelection?: boolean
  // 是否显示索引列
  showIndex?: boolean
  // 是否显示表格工具栏
  showToolbar?: boolean
  // 是否显示边框
  border?: boolean
  // 是否显示斑马纹
  stripe?: boolean
  // 是否显示分页
  enablePagination?: boolean
  // 总数据量
  total?: number
  // 当前页码
  page?: number
  // 每页数量
  limit?: number
  // 分页大小选项
  pageSizes?: number[]
  // 分页布局
  paginationLayout?: string
  // 加载状态
  loading?: boolean
  // 操作列宽度
  actionWidth?: number | string
  // 操作列固定位置
  actionFixed?: boolean | 'left' | 'right'
}
